﻿/* SOME Colors (to remind) */

/* Pink:                    #D26BAC
/* Blue menus:              #35CCF5
/* Blue menus highlight:    #21ABD9
/* Dark blue text:          #011E56
/* Background light blue:   #E9F8FC
*/




/********************/
/* PAGE BASE STYLES */
/********************/

.MyMatrix_canvas
{
    vertical-align: top;
    width: 986px;
    margin-left: auto;
    margin-right: auto;
}



/*********************/
/* PAGE HEADER STYLE */
/*********************/

.MyMatrix_header
{
    width: 100%;
    text-align: left;
    color: #006FA8;
    font-size: x-small;
}

#MyMatrix_headerDate
{
    width: 180px;
    text-align: left;
}

.Logo
{
    text-align: left;
    width: 200px;
    height: 70px;
}


/*************/
/* MAIN MENU */
/*************/

.boxNav
{
    background-position: left top;
    text-decoration: none;
    vertical-align: middle;
    width: 400px;
    background: url(../images/navBg.jpg) repeat-x left top;
    height: 42px;
    text-align: left;
}

.celNavLeft
{
    width: 20px;
    background: url(../images/navBg_left.jpg) no-repeat left top;
    vertical-align: top;
}

.celNavRight
{
    width: 20px;
    background: url(../images/navBg_right.jpg) no-repeat right top;
}

.celNavMenu
{
    cursor: pointer;
    padding: 0;
    font-family: 'Calibri' ,Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight: normal;
    text-align: left;
    letter-spacing: 0em;
    width: 95px;
    text-indent: 5px;
}

.celNavMenu a
{
    color: #006FA8;
    text-decoration: none;
}

.celNavMenu:hover
{
    background-position: left top;
    background: #69B6D0 url(../images/navBgHover.gif) no-repeat center top;
    text-decoration: none;
}

.celNavSubMenu
{
    background-position: left top;
    font-family: 'Calibri' ,Arial, Helvetica, sans-serif;
    letter-spacing: 0.1em;
    font-size: 14px;
    background: #69B6D0 url(../images/sub_bg.gif) repeat-x center top;
    color: #FFFFFF;
    padding: 3px;
    text-decoration: none;
    border-color: #C7EAF5;
    background-color: #35CCF5;
}
.celNavSubMenu:hover
{
    background-color: #21ABD9;
    background: #69B6D0 url(../images/sub_bg_over.jpg) repeat-x center top;
}

.celNavSubMenu:hover
{
    background-color: #21ABD9;
}

.celNavSubMenu a
{
    text-decoration: none;
}



/***************************/
/* PAGE MAIN CONTENT STYLE */
/***************************/

.MyMatrix_body
{
    background-color: #FFFFFC;
    width: 100%;    
    background-image: url(../images/mainTable.jpg);
    background-repeat: no-repeat;
    background-position: left top;
    vertical-align: top;
    border-bottom: 0px solid red;
}

.MyMatrix_body table
{
    width: inherit;
}

#content
{
    width: inherit;
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 15px;
}

body
{
    height: 100%;
    overflow: auto;
    margin-bottom: 15px;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
    letter-spacing: 0.1em;
    font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #011E56;
    line-height: 16px;
    letter-spacing: 0.1em;
    background-image: url('../images/Background.jpg');
}

.title
{
    font-family: 'Calibri' ,Arial, Helvetica, sans-serif;
    font-size: 26px;
    line-height: 28px;
    color: #21ABD9;
    letter-spacing: 0em;
    text-align: left;
}
.subtitle
{
    font-family: 'Calibri' ,Arial, Helvetica, sans-serif;
    font-size: 20px;
    color: #1B8DB3;
    line-height: 22px;
    letter-spacing: 0em;
    text-align: left;
}
.titleHighlight
{
    font-family: 'Calibri' ,Arial, Helvetica, sans-serif;
    font-size: 18px;
    color: #011E56;
    text-decoration: none;
    line-height: 20px;
    letter-spacing: 0em;
}
.subtitleHighlight
{
    font-family: Verdana, Arial, Helvetica, sans-serif;
    color: #21ABD9;
    font-size: 16px;
    line-height: 19px;
    font-weight: normal;
    letter-spacing: 0.0em;
    padding-bottom: 8px;
    text-align: left;
}

.normalHighlight
{
    font-family: 'Calibri' ,Arial, Helvetica, sans-serif;
    color: #1B8DB3;
    line-height: 22px;
    letter-spacing: 0em;
    text-align: left;
    font-weight: bold;
    font-size: 14px;
}



/***********/
/* BUTTONS */
/***********/

.Buttons
{
    display: block;
    float: right;
}

.btnAdd
{
    background-image: url('../images/btnAdd.png');
    width: 90px;
    height: 25px;
    display: block;
    text-align: right;
}
.btnAdd:hover
{
    background-position: left bottom;
}

.btnRemover
{
    background-image: url('../images/btnRemove.png');
    width: 90px;
    height: 25px;
    display: block;
}
.btnRemover:hover
{
    background-position: left bottom;
}

.btnSubmit
{
    background-image: url('../images/btnSubmit.png');
    width: 90px;
    height: 25px;
    display: block;
}
.btnSubmit:hover
{
    background-position: left bottom;
}

.btnUpdate
{
    background-image: url('../images/btnUpdate.png');
    width: 90px;
    height: 25px;
    display: block;
    float: right;
}

.btnUpdate:hover
{
    background-position: left bottom;
}

.btnCancel
{
    background-image: url('../images/btnCancel.png');
    width: 90px;
    height: 25px;
    display: block;
}

.btnCancel:hover
{
    background-position: left bottom;
}

.btnSave
{
    background-image: url('../images/btnSave.png');
    width: 90px;
    height: 25px;
    display: block;
}
.btnSave:hover
{
    background-position: left bottom;
}



/* */
/* FOOTER */
/* */

.MyMatrix_footer
{
    height: 30px;
    background-color: #FFFFFC;
}

.boxGeneralInfo
{
    width: 100%;
    color: #FFFFFF;
    vertical-align: top;
    text-align: center;
}

#MyMatrix_footer .boxGeneralInfo
{
    background: #FFFFFC url(../images/Baseboard_links_bg.gif) repeat-x bottom left;
}

#MyMatrix_footer table
{
    padding-left: 20px;
    height: 30px;
}

#MyMatrix_footer a, .boxBaseboard a
{
    font-family: 'Calibri' ,Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #006FA8;
    letter-spacing: 0.0em;
}

#MyMatrix_footer a:hover, .boxBaseboard a:hover
{
    color: #D26BAC;
    text-decoration: underline;
}

.boxBaseboard
{
    height: 45px;
    width: 100%;
}
.baseboard_txt
{
    color: #006FA8;
    font-family: "Calibri" ,Tahoma, Arial, Helvetica, sans-serif;
    text-align: center;
    font-size: 13px;
    padding-top: 26px;
    letter-spacing: 0.0em;
    vertical-align: bottom;
}
.baseboard_left
{
    width: 20px;
    background-image: url(../images/Baseboard_left.png);
    background-repeat: no-repeat;
    background-position: left top;
}
.baseboard_center
{
    background-image: url(../images/Baseboard_center.png);
    background-repeat: repeat-x;
    background-position: center top;
}
.baseboard_right
{
    width: 20px;
    background-image: url(../images/Baseboard_right.png);
    background-repeat: no-repeat;
    background-position: right top;
}



/* */
/* SEPARATORS */
/* */
.celSepHColorCenter
{
    background-position: center center;
    background: url(../images/SepHColorCenter.gif) center center repeat-x;
    width: 870px;
    height: 10px;
}
.celSepHColorLeft
{
    background: url(../images/SepHColorCenter.gif) center left repeat-x;
    width: 30px;
    height: 10px;
}
.celSepHColorRight
{
    background: url(../images/SepHColorCenter.gif) center right repeat-x;
    width: 30px;
    height: 10px;
}


/********/
/* Links*/
/********/

.linkTop
{
    font-family: "Calibri" ,Tahoma, Arial, Helvetica, sans-serif;
    letter-spacing: normal;
    font-size: 12px;
    color: #006FA8;
    text-decoration: none;
    padding: 3px;
    letter-spacing: 0.0em;
}

.linkTop:hover
{
    color: #D26BAC;
    text-decoration: underline;
}

.linkHighlight
{
    font-size: 17px;
    color: #1B8DB3;
    text-decoration: none;
    line-height: 16px;
}

a.linkHighlight
{
    color: #1B8DB3;
}
a.linkHighlight:hover
{
    color: #D26BAC;
}
.linkTrack
{
    color: #006FA8;
    text-decoration: none;
    padding: 3px;
}
.linkTrack:hover
{
    color: #006FA8;
    text-decoration: underline;
}



/********************/
/* Other Components */
/********************/

.MyLink
{
    font-family: "Calibri" ,Tahoma, Arial, Helvetica, sans-serif;
    letter-spacing: normal;
    font-size: 12px;
    color: #006FA8;
    text-decoration: none;
    letter-spacing: 0.0em;    
}

.MyLink:hover
{
    color: #D26BAC;
    text-decoration: underline;
}

.ListTable
{
    width: 100%;
    font-size: 11px;
    position: relative;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;    
}

.ListTable th
{
    text-align:left;
}

.EditTable
{
    width: auto;
}

.EditTable_Col1
{
    width: 80px;
    padding-left:15px;  
}

.EditTable_Col2
{
    width:150px; 
    padding:0;  
}

.EditTable_Col3
{
    width: 80px;  
    padding-left:15px;
}

.EditTable_Col4
{
    width:300px;
    padding:0; 
}

.EditTable_Col5
{
    width:auto;  
}

.EditTable_Col6
{
    width:200px;
    padding-left:15px;
}

.EditField
{
    width:100%;   
}